import './card.scss';
import React, { ClassicComponent, FunctionComponent } from 'react';

interface CardProps {
    title: string;
    width: number | string;
    children: JSX.Element | ClassicComponent | FunctionComponent | null;
}
/**
 * @function Card 卡片组件
 * @param {CardProps} props props数据
 * @returns 返回卡片组件
 */
export default function Card (props: CardProps) {
    const { title, width, children } = props;
    // console.log(children);
    return (<section className="cardContiner" style={{ width: (typeof width === 'number') ? `${width}px` : width }}>
        <header className="cardTitle">
            {title}
        </header>
        <main className='cardMain'>
            {children ? children : <div>暂无内容</div>}
        </main>
    </section>);
}
